<template>
  <div rounded-40rpx bg="#fff" pa-40rpx box-border mx-40rpx w-670rpx>
    <div w-full flex items-center justify-between>
      <div flex items-center>
        <image
          v-if="props.res.data.img"
          :src="props.res.data.img"
          w-36rpx
          h-40rpx
          mr-20rpx
        ></image>
        <div font-500 text="#000" text-32rpx>{{ props.res.data.title }}</div>
      </div>
      <div flex items-center @click="moreList">
        <div font-500 text="#7D7D7D" text-24rpx mr-16rpx>更多</div>
        <image src="@/static/more_right.png" w-12rpx h-20rpx></image>
      </div>
    </div>
    <div>
      <template v-for="(item, index) in props.res.data.list">
        <article_item
          :item="item.url"
          classifyStyle="1"
          :isLastItem="index === props.res.data.list.length - 1"
          @click="clickSwiper(index)"
        ></article_item>
      </template>
    </div>
  </div>
</template>

<script setup lang="ts">
import { modelNavigateTo } from './tpl-v3'
import { px2rpx } from './px2rpx'
import article_item from '@/components/article-item/index.vue' //轮播图
const height = uni.getSystemInfoSync().screenWidth * 0.2
const props = defineProps(['res'])
console.log('文章列表', props)
function clickSwiper(index: number) {
  modelNavigateTo(props.res.data.list[index])
}

function moreList() {
  uni.navigateTo({
    url: '/pages/funcPage?functionCode=' + props.res.data.functionCode + '&functionName=' + props.res.data.title
  })
}
</script>
<style lang="scss" scoped>
img,
image {
  display: block !important;
}
</style>
